<template>
	<view class="container">
		<uni-easyinput class="uni-mt-5" suffixIcon="search" v-model="searchData" placeholder="请选择维修项目"
			@iconClick="iconClick">
		</uni-easyinput>
		<view class="scroll-container">
			<uni-segmented-control :current="current" :values="items" @clickItem="onClickItem" styleType="text">
			</uni-segmented-control>
			<view class="content">
				<view v-show="current === 0">
					<view v-for=" v in furniture" :key="v.name" class="level" @click="goto(v.name)">
						<text>{{v.name}}</text>
					</view>
				</view>
				<view v-show="current === 1">
					<view v-for=" v in circuit" :key="v.name" class="level" @click="goto(v.name)">
						<text>{{v.name}}</text>
					</view>
				</view>
				<view v-show="current === 2">
					<view v-for=" v in plumbing" :key="v.name" class="level" @click="goto(v.name)">
						<text>{{v.name}}</text>
					</view>
				</view>
				<view v-show="current === 3">
					<view v-for=" v in lock" :key="v.name" class="level" @click="goto(v.name)">
						<text>{{v.name}}</text>
					</view>
				</view>
				<view v-show="current === 4">
					<view v-for=" v in electric" :key="v.name" class="level" @click="goto(v.name)">
						<text>{{v.name}}</text>
					</view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		http
	} from '../../../utils/http.js';
	export default {
		data() {
			return {
				searchData: "",
				searchRes: [],
				items: [],
				furniture: [],
				circuit: [],
				lock: [],
				electric: [],
				plumbing: [],
				current: 0,

			}
		},
		methods: {
			iconClick() {
				http({
					url: '/secondItem/query',
					params: {
						secondItemType: this.searchData
					}
				}).then((res) => {
					switch (res[0].repairProject.maintenanceItemType) {
						case '家具':
							this.current = 0;
							break;
						case '电路':
							this.current = 1;
							break;
						case '水暖':
							this.current = 2;
							break;
						case '门锁':
							this.current = 3;
							break;
						case '电器':
							this.current = 4;
							break;
					}
				})
			},
			onClickItem(e) {
				if (this.current != e.currentIndex) {
					this.current = e.currentIndex;
				}
			},
			goto(e) {
				let data;
				switch (this.current) {
					case 0:
						data = '家具' + '-' + e;
						break;
					case 1:
						data = '电路' + '-' + e;
						break;
					case 2:
						data = '水暖' + '-' + e;
						break;
					case 3:
						data = '门锁' + '-' + e;
						break;
					case 4:
						data = '电路' + '-' + e;
						break;
				}
				uni.navigateTo({
					url: '/pages/maintenancereport/maintenanceinformation/maintenanceinformation?data=' + data
				})
			}
		},
		onLoad() {
			let p1 = http({
				url: '/repairProject/list'
			});
			let p2 = http({
				url: '/appliance/list'
			});
			let p3 = http({
				url: '/doorLock/list'
			});
			let p4 = http({
				url: '/electricCircuit/list'
			});
			let p5 = http({
				url: '/furniture/list'
			});
			let p6 = http({
				url: '/plumbing/list'
			});
			Promise.all([p1, p2, p3, p4, p5, p6]).then((res) => {
				//一级菜单
				let _item = [];
				res[0].forEach((v) => {
					_item.push(v.maintenanceItemType);
				});
				this.items = [..._item];

				//二级菜单-家具
				let _furniture = [];
				res[4].forEach((v) => {
					_furniture.push({
						id: v.secondItemId,
						name: v.secondItemType
					});
				});
				this.furniture = [..._furniture];
				//二级菜单-电路
				let _circuit = [];
				res[3].forEach((v) => {
					_circuit.push({
						id: v.secondItemId,
						name: v.secondItemType
					});
				});
				this.circuit = [..._circuit];
				//二级菜单-门锁
				let _lock = [];
				res[2].forEach((v) => {
					_lock.push({
						id: v.secondItemId,
						name: v.secondItemType
					});
				});
				this.lock = [..._lock];
				//二级菜单-电器
				let _electric = [];
				res[1].forEach((v) => {
					_electric.push({
						id: v.secondItemId,
						name: v.secondItemType
					});
				});
				this.electric = [..._electric];
				//二级菜单-水暖
				let _plumbing = [];
				res[5].forEach((v) => {
					_plumbing.push({
						id: v.secondItemId,
						name: v.secondItemType
					});
				});
				this.plumbing = [..._plumbing];
			});
		}
	}
</script>

<style lang="less" scoped>
	.container {
		width: 750rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: flex-start;

		/deep/.uni-easyinput__content {
			width: 682rpx;
			height: 100rpx;
			border-radius: 50rpx 50rpx 50rpx 50rpx;
			margin: 36rpx auto;
			background: #efefef !important;
		}

		.scroll-container {
			width: 750rpx;
			display: flex;
			justify-content: space-around;
			align-items: flex-start;

			/deep/.segmented-control {
				width: 240rpx;
				height: 650rpx;
				display: flex;
				flex-direction: column;
				background: #f6f7f7;
			}

			.content {
				flex: 1;

				.level {
					height: 96rpx;
					display: flex;
					align-items: center;
					border-bottom: 1px solid #efefef;


					text {
						margin-left: 78rpx;
						font-size: 28rpx;
						font-family: 'PingFangSC-Regular', 'PingFang SC', sans-serif;
					}
				}
			}
		}

	}
</style>
